<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="browsermode" content="application">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="Cache" content="no-cache">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
    <!-- 禁止百度转码 -->
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <!-- uc强制竖屏 -->
    <meta name="screen-orientation" content="portrait">
    <!-- QQ强制竖屏 -->
    <meta name="x5-orientation" content="portrait">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta name="format-detection" content="telephone=no">
    <title>限时抢购</title>
    <link rel="stylesheet" href="${request.contextPath}/web/css/reset.css?v=${verison!}">
    <link rel="stylesheet" href="${request.contextPath}/web/css/base.css?v=${verison!}">
    <style>
		.integral-details .header {
			background-image: url();
			background-repeat: no-repeat;
			background-size: 100% 100%;
			width: 100%;
			height: 4.6rem;
			font-size: .72rem;
			color: #fff;
			padding: .31rem 0 .45rem 0;
			text-align: center;
			font-family: GuildfordProBook\ 5;
		}
		.integral-details .header .currentScore {
			font-size: .26rem;
			color: hsla(0,0%,100%,.8);
			text-align: center;
			margin-bottom: .05rem;
		}
		.integral-details .header .line {
			width: .6rem;
			height: .03rem;
			background-color: #fff;
			margin: .2rem auto 0 auto;
		}
		.integral-details .header .nav {
			font-size: .22rem;
			color: hsla(0,0%,100%,.8);
			-webkit-box-flex: 1;
			flex: 1;
			-webkit-flex: 1;
			-o-flex: 1;
			-ms-flex: 1;
			margin-top: .35rem;
		}
		.integral-details .header .nav .item {
			width: 33.33%;
			text-align: center;
		}
		.integral-details .header .nav .item .num {
			color: #fff;
			font-size: .4rem;
		}
		.integral-details .wrapper .nav {
			-webkit-box-flex: 1;
			flex: 1;
			-webkit-flex: 1;
			-o-flex: 1;
			-ms-flex: 1;
			width: 6.9rem;
			border-radius: .2rem .2rem 0 0;
			margin: -.96rem auto 0 auto;
			background-color: #f7f7f7;
			height: .96rem;
			font-size: .3rem;
			color: #bbb;
		}
		.integral-details .wrapper .nav .item.on {
			background-color: #fff;
			color: #e93323;
			font-weight: 700;
			border-radius: .2rem 0 0 0;
		}
		.integral-details .wrapper .nav .item {
			text-align: center;
			width: 50%;
		}
		.integral-details .wrapper .nav .item .iconfont {
			font-size: .38rem;
			margin-right: .1rem;
		}
		.integral-details .wrapper .nav .item:nth-of-type(2) {
			border-radius: 0 .2rem 0 0;
		}
		.integral-details .wrapper .list {
			background-color: #fff;
			padding: .24rem .3rem;
		}
		.integral-details .wrapper .list .tip {
			font-size: .25rem;
			width: 6.9rem;
			height: .6rem;
			border-radius: .5rem;
			background-color: #fff5e2;
			border: 1px solid #ffeac1;
			color: #c8a86b;
			padding: 0 .2rem;
			margin-bottom: .24rem;
		}
		.integral-details .wrapper .list .tip .iconfont {
			font-size: .35rem;
			margin-right: .15rem;
		}
		.integral-details .wrapper .list .item {
			height: 1.24rem;
			border-bottom: 1px solid #eee;
			font-size: .24rem;
			color: #999;
		}
		.integral-details .wrapper .list .item .state {
			font-size: .28rem;
			color: #282828;
			margin-bottom: .08rem;
		}
		.integral-details .wrapper .list .item .num {
			font-size: .3rem;
			font-family: GuildfordProBook\ 5;
			color: #16ac57;
		}
		.integral-details .wrapper .list2 {
			background-color: #fff;
			padding: .24rem 0;
		}
		.integral-details .wrapper .list2 .item {
			background-image: -webkit-gradient(linear,left top,right top,from(#fff7e7),to(#fffdf9));
			background-image: linear-gradient(90deg,#fff7e7 0,#fffdf9);
			background-image: -moz-linear-gradient(to right,#fff7e7 0,#fffdf9 100%);
			width: 6.9rem;
			height: 1.8rem;
			position: relative;
			border-radius: .1rem;
			margin: 0 auto .2rem auto;
			padding: 0 .25rem 0 1.8rem;
		}
		.integral-details .wrapper .list2 .item .pictrue {
			width: .9rem;
			height: 1.5rem;
			position: absolute;
			bottom: 0;
			left: .45rem;
		}
		.integral-details .wrapper .list2 .item .pictrue img {
			width: 100%;
			height: 100%;
		}
		.integral-details .wrapper .list2 .item .name {
			width: 2.85rem;
			font-size: .3rem;
			font-weight: 700;
			color: #c8a86b;
		}
		.integral-details .wrapper .list2 .item .earn {
			font-size: .26rem;
			color: #c8a86b;
			border: .02rem solid #c8a86b;
			text-align: center;
			line-height: .52rem;
			height: .52rem;
			width: 1.6rem;
			border-radius: .5rem;
		}
	</style>
</head>
<script type="text/javascript" src="${request.contextPath}/web/js/media_750.js"></script>
<script type="text/javascript" src="${request.contextPath}/web/js/jquery.min.js"></script>
<script type="text/javascript" src="${request.contextPath}/web/js/jquery.mobile.min.js"></script>
<script type="text/javascript" src="${request.contextPath}/web/js/common.js"></script>
<body style="background-color: rgb(255, 255, 255);">
<div data-role="page">
    <div class="app">
        <div class="integral-details router">
            <div class="header">
                <div class="currentScore">
                    当前积分
                </div>
                <div>
                    ${totalScore!}
                </div>
                <div class="line"></div>
                <div class="nav acea-row">
                    <div class="item">
                        <div class="num">
                            ${totalGetScore!}
                        </div>
                        <div>
                            累计积分
                        </div>
                    </div>
                    <div class="item">
                        <div class="num">
                            ${totalPutScore!}
                        </div>
                        <div>
                            累计消费
                        </div>
                    </div>
                    <div class="item">
                        <div class="num">
                            ${todayScore!}
                        </div>
                        <div>
                            今日获得
                        </div>
                    </div>
                </div>
            </div>
            <div class="wrapper">
                <div class="nav acea-row">
                    <div class="item acea-row row-center-wrapper on">
                        <span class="iconfont icon-mingxi"></span>分值明细
                    </div>
                    <div class="item acea-row row-center-wrapper">
                        <span class="iconfont icon-tishengfenzhi"></span>分值提升
                    </div>
                </div>
                <div class="list">
                    <#if data??>
                        <#list data as item>
                            <div class="item acea-row row-between-wrapper">
                                <div>
                                    <div class="state">
                                        ${item.remark!}
                                    </div>
                                    <div>
                                        ${item.createDate?string("yyyy/MM/dd HH:mm")}
                                    </div>
                                </div>
                                <#if item.type==1>
                                    <div class="num">
                                        +${item.score!}
                                    </div>
                                <#else>
                                    <div class="num font-color-red">
                                        -${item.score!}
                                    </div>
                                </#if>
                            </div>
                        </#list>
                    </#if>
                </div>
                <div class="list2"   hidden="hidden">
                    <a href="${request.contextPath}/web/index" class="item acea-row row-between-wrapper router-link-active">
                        <div class="pictrue">
                            <img src="${request.contextPath}/web/images/score.30715cf5.png" />
                        </div>
                        <div class="name">
                            购买商品可获得积分奖励
                        </div>
                        <div class="earn">
                            赚积分
                        </div></a>
                    <a href="${request.contextPath}/web/partnerApply" class="item acea-row row-between-wrapper">
                        <div class="pictrue">
                            <img src="./images/score.30715cf5.png" />
                        </div>
                        <div class="name">
                            申请合伙人可获得积分奖励
                        </div>
                        <div class="earn">
                            赚积分
                        </div></a>
                </div>
            </div>
            <!---->
        </div>
        <#include "include/right.html" />
    </div>
</body>
<script>

$(function(){
	$(".nav .row-center-wrapper").on('click',function(){
		$(this).addClass("on");
		$(this).siblings('.row-center-wrapper').removeClass('on');
		var index = $(this).index();
		if(index == 0){
			$(".list").removeAttr("hidden");
			$(".list2").attr("hidden","hidden");
		}else{
			$(".list2").removeAttr("hidden");
			$(".list").attr("hidden","hidden");
		}
	});
});

</script>
</html>